<template>
    <view class="">
        <view class="header-c ls-f-ac">
            <image :src="teacher.icon"
                   mode="aspectFill"
                   class="img-c"></image>
            <view class="">
                <view class="name">
                    {{teacher.name||""}}
                </view>
                <view class="phone">
                    {{teacher.telNo||""}}
                </view>
            </view>
            <image src="../../../static/images/common_pic_ytg@2x.png"
                   v-if="status==1"
                   mode=""
                   class="icon"></image>
            <image src="../../../static/images/common_pic_wtg@2x.png"
                   v-if="status==-1"
                   mode=""
                   class="icon"></image>
            <image src="../../../static/images/common_pic_spz@2x.png"
                   v-if="status==0"
                   mode=""
                   class="icon"></image>
        </view>
        <view class="content"
              v-if="type==0">
            <view class="liem ls-f-ajsb">
                <view class="f-32">请假课程</view>
                <view class="ls-f-ac">
                    <text class="f-32-g">{{arr.productName||""}}</text>
                    <!-- <u-icon name="arrow-right" color="#999"></u-icon> -->
                </view>
            </view>
            <view class="liem ls-f-ajsb"
                  style="padding-top: 32rpx;">
                <view class="f-32">请假时间</view>
                <view class="ls-f-ac">
                    <text class="f-32-g">{{arr.leaveTime||""}}</text>
                    <!-- <u-icon name="arrow-right" color="#999"></u-icon> -->
                </view>
            </view>
            <view class="input">
                <view class="f-32">请假原因</view>
                <view class="f-32"
                      style="margin-top: 32rpx;">{{arr.remake||""}}</view>
                <!-- <textarea value="" v-model="text" placeholder="请填写作业内容" /> -->
                <!-- <text class="text-length">{{text.length}}/600字</text> -->
            </view>
        </view>

        <view class="content"
              v-else
              style="height: 430rpx;">
            <view class="liem ls-f-ajsb">
                <view class="f-32">代课课程</view>
                <view class="ls-f-ac">
                    <text class="f-32-g">{{arr.productName||""}}</text>
                </view>
            </view>
            <view class="liem ls-f-ajsb"
                  style="padding-top: 32rpx;">
                <view class="f-32">代课时间</view>
                <view class="ls-f-ac">
                    <text class="f-32-g">{{arr.leaveTime||""}}</text>
                    <u-icon name="arrow-right"
                            color="#999"></u-icon>
                </view>
            </view>
            <view class="liem ls-f-ajsb"
                  style="padding-top: 32rpx;">
                <view class="f-32">代课老师</view>
                <view class="ls-f-ac">
                    <text class="f-32-g">{{arr.takeUserName||""}}</text>
                    <u-icon name="arrow-right"
                            color="#999"></u-icon>
                </view>
            </view>
            <view class="liem ls-f-ajsb"
                  style="padding-top: 32rpx; border-bottom: none;">
                <view class="f-32">联系方式</view>
                <view class="ls-f-ac">
                    <text class="f-32-g">{{arr.takeTelNo||""}}</text>

                </view>
            </view>

        </view>
        <view class="input-box"
              v-if="type==1">
            <view class="input">
                <view class="f-32">课程内容</view>
                <view class="f-32"
                      style="margin-top: 32rpx;height: ;">{{arr.remake||""}}</view>
            </view>
        </view>
        <view class="btn ls-f-ajc"
              @click="submit"
              v-if="arr.status==0">
            <view class="b ls-f-ajc">
                撤销申请
            </view>
        </view>
    </view>
</template>

<script>
export default {
    data() {
        return {
            arr: [],
            teacher: {},
            type: 2,
            showSchool: false,
            status: 1,
            courseList: [{
                value: '1',
                label: '江'
            },
            {
                value: '2',
                label: '湖'
            }],
            text: '',
            currentIndex: 0
        }
    },
    methods: {
        init() {
            this.$api.getTeacherInfo({}, res => {
                console.log(res.data);
                this.teacher = res.data

            })
        },
        submit() {
            let that = this;
            uni.showModal({
                title: '提示',
                content: '确定要撤销申请吗？',
                success: function (res) {
                    if (res.confirm) {
                        if (that.type == 0) {
                            that.$api.delleave({ id: that.arr.id }, res => {
                                if (res.code == 0) {
                                    uni.showToast({
                                        title: res.errMsg || "成功",
                                        duration: 1500,
                                        icon: 'none'
                                    });
                                    setTimeout(() => {
                                        uni.navigateBack({
                                            delta: 1
                                        })
                                    }, 1500);

                                }
                            })
                        } else {
                            that.$api.deltakeClass({ id: that.arr.id }, res => {
                                if (res.code == 0) {
                                    uni.showToast({
                                        title: res.errMsg || "成功",
                                        duration: 1500,
                                        icon: 'none'
                                    });
                                    setTimeout(() => {
                                        uni.navigateBack({
                                            delta: 1
                                        })
                                    }, 1500);

                                }
                            })
                        }
                    } else if (res.cancel) {
                        console.log('用户点击取消');
                    }
                }
            });
        },
        confirmSchool() {

        },
        sel(e) {
            this.currentIndex = e
        },
        add() {
            uni.navigateTo({
                url: 'addWork'
            })
        }
    },
    onLoad(option) {
        this.arr = JSON.parse(option.item);
        this.currentIndex = option.type
        this.type = option.type
        console.log("aaaaaaaaa", this.arr)
        this.init();
    }
}
</script>

<style scoped lang="scss">
.input-box {
    position: relative;
    width: 686rpx;
    // height: 380rpx;
    background: #ffffff;
    opacity: 1;
    border-radius: 32rpx;
    padding: 32rpx;
    margin: 32rpx;
	padding-bottom: 130rpx;
    .input {
        margin-top: 32rpx;
        position: relative;
        .text-length {
            color: #999999;
            font-size: 28rpx;
            position: absolute;
            right: 0;
            bottom: 20rpx;
        }
    }
}

.icon {
    width: 136rpx;
    height: 136rpx;
    position: absolute;
    bottom: 20rpx;
    right: 20rpx;
}
.btn {
    position: fixed;
    bottom: 0;
    left: 0;
    width: 750rpx;
    padding-top: 10rpx;
    padding-bottom: 40rpx;
    background-color: #fff;
    .b {
        color: #fff;
        font-size: 32rpx;
        width: 684rpx;
        height: 100rpx;
        background: #63b9f2;
        opacity: 1;
        border-radius: 50rpx;
    }
}
.content {
    width: 686rpx;
    height: 604rpx;
    background: #ffffff;
    margin-top: 32rpx;
    border-radius: 32rpx;
    padding: 32rpx;
    margin-left: 32rpx;
    .input {
        margin-top: 32rpx;
        position: relative;
        .text-length {
            color: #999999;
            font-size: 28rpx;
            position: absolute;
            right: 0;
            bottom: 0;
        }
    }
    .liem {
        padding-bottom: 30rpx;
        border-bottom: 1rpx solid #eee;
    }
}
.header-c {
    position: relative;
    padding: 48rpx 32rpx;
    width: 750rpx;
    height: 192rpx;
    background: #ffffff;
    opacity: 1;
    border-radius: 0px 0px 32rpx 32rpx;

    .img-c {
        width: 96rpx;
        height: 96rpx;
        margin-right: 30rpx;
    }
}
</style>
